<!--
 * @Author: TANGB02 13233582+Ace-Tang@user.noreply.gitee.com
 * @Date: 2024-01-29 16:46:06
 * @LastEditors: TANGB02 13233582+Ace-Tang@user.noreply.gitee.com
 * @LastEditTime: 2024-03-06 16:47:57
 * @FilePath: \ycq\ycq\ycq1.0\src\pages\manager\userManage.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div>
    <div class="userTable">
      <a-table
        :dataSource="dataSource"
        :columns="columns"
        :pagination="pagination"
        @change="handleTableChange"
      >
        <template #bodyCell="obj">
          <div v-if="obj.column.dataIndex === 'applicationStatus'">
            <!-- {{ obj.record }} -->
            <a-select
              v-model:value="obj.record.applicationStatus"
              label-in-value
              style="width: 100px; border-radius: 1px !important"
              :options="options"
              @change="
                (value, option) =>
                  handleChange(
                    value,
                    option,
                    obj.record.animalNumbers,
                    obj.record.userId,
                    obj.record.applicationNumbers
                  )
              "
            />
          </div>
        </template>
      </a-table>
    </div>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { message } from "ant-design-vue";
import { SearchOutlined } from "@ant-design/icons-vue";
import { getAllApplication, updataApplication } from "@/service/api.js";

const valueSlect = ref({
  value: 5,
  label: "全部",
});
const options = ref([
  {
    value: 0,
    label: "审核中",
  },
  {
    value: 1,
    label: "已通过",
  },
  {
    value: 2,
    label: "已拒绝",
  },
  {
    value: 3,
    label: "已取消",
  },
]);
const pagination = ref({
  current: 1,
  total: 0,
  pageSize: 10,
  showTotal: (total) => `共 ${total} 条数据`,
  showQuickJumper: true,
});
const dataSource = ref([]);
const columns = ref([
  {
    title: "申请人编号",
    dataIndex: "userId",
    align: "center",
  },
  {
    title: "申请人姓名",
    dataIndex: "applicationName",
    align: "center",
  },
  {
    title: "联系电话",
    dataIndex: "phone",
    align: "center",
  },
  {
    title: "申请编号",
    dataIndex: "applicationNumbers",
    align: "center",
  },
  {
    title: "动物编号",
    dataIndex: "animalNumbers",
    align: "center",
  },
  {
    title: "申请说明",
    dataIndex: "applicationDescription",
    align: "center",
  },

  {
    title: "申请时间",
    dataIndex: "applicationTime",
    align: "center",
  },
  {
    title: "申请状态",
    dataIndex: "applicationStatus",
    align: "center",
  },
]);

const getData = async () => {
  const res = await getAllApplication({
    size: pagination.value.pageSize,
    current: pagination.value.current,
  });
  console.log(res);
  dataSource.value = res.data.data.records;
  pagination.value.total = res.data.data.total;
};
getData();

//改变页数
const handleTableChange = (pageObj) => {
  console.log(pageObj);
  pagination.value = pageObj;
  getData();
};
//下拉框变化
const handleChange = async (
  value,
  option,
  animalsNum,
  userId,
  applicationNumbers
) => {
  console.log(value);
  console.log(option);
  console.log(animalsNum);
  console.log(userId);

  const res = await updataApplication({
    animalNumbers: animalsNum,
    applicationStatus: value.value,
    userId,
    applicationNumbers,
  });
  console.log(res);
  if (res.code === 1) {
    message.success(res.data);
  } else message.error("处理失败");
};
</script>
<style scoped></style>
